<!-- 我发布的 -->
<template>
	<view class="goshop-published-container">
		<u-toast ref="uToast"></u-toast>
		<view class="goshop-published-tabs">
			<u-tabs
			class="u-flex-middle"
			lineColor="#f56c6c"
			:activeStyle="{
				color: '#303133',
				fontWeight: 'bold',
				transform: 'scale(1.05)'
			}"
			:inactiveStyle="{
				color: '#606266',
				transform: 'scale(1)'
			}"
			:scrollable="false"
			itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;"
			:list="list" @click="click"></u-tabs>
		</view>
		<view class="goshop-published-wrap">
			<!-- 空白页 -->
			<u-empty v-if="isEmpty === true && goodDataList.length === 0" :text="emptyText" mode="list"></u-empty>
			<view class="goshop-published-list">
				<view class="goshop-published-item" v-for="(item,index) in goodDataList" :key="index">
					<view class="goshop-published-item-head">
						<view>{{releasetimeText}}：{{item.createTime}}</view>
						<view>{{item.status | statusName(that) }}</view>
					</view>
					<view class="goshop-published-item-body" @click="onGoodClick(item)">
						<view class="goshop-published-item-body-left">
							<image class="goshop-img-62" :src="item.thumbnail"></image>
						</view>
						<view class="goshop-published-item-body-right">
							<view>{{item.name}}</view>
							<view class="goshop-published-item-body-right-center">
								<view>{{classifyText}}：{{item.categoryName}}</view>
								<view>{{browseText}}：{{item.browses}}</view>
							</view>
							<view>
								{{priceText}}：{{moneyText}}{{item.price}}
							</view>
						</view>
					</view>
					<view class="goshop-published-item-footer">
						<view @tap="doDelete(item.id)" class="goshop-published-item-footer-bt bt-width">{{deleteText}}</view>
						<view @tap="doUpDownRack(item.id,2)" v-if="item.status > 0 && item.status == 3" class="goshop-published-item-footer-bt bt-width">{{superiorText}}</view>
						<view @tap="doUpDownRack(item.id,3)" v-if="item.status > 0 && item.status == 2" class="goshop-published-item-footer-bt bt-width">{{underText}}</view>
						<view @tap="doEdit(item.id)" class="goshop-published-item-footer-bt bt-width">{{editText}}</view>
					</view>
				</view>
			</view>
			<u-loadmore 
					:status="loadStatus" 
					:loading-text="loadingText" 
					:loadmore-text="loadmoreText" 
					:nomore-text="nomoreText" 
					loadingIcon="semicircle"
					@loadmore="getGoodPage"
				/>
		</view>
	</view>
</template>

<script>
	import {goodPage,upDownRack,deleteGood} from '@/common/http.api.js'
	import jwt from '@/utils/jwt.js'
	export default {
		data() {
			return {
				 //加载更多标志
				 loadMoreFlag:false,
				 isEmpty:false,
				 goodDataList: [],
				 loadStatus: 'loadmore',
				 loadingText: '',
				 loadmoreText: '',
				 emptyText:'',
				 nomoreText: '',
				 deleteText:'',
				 editText:'',
				 superiorText:'',
				 underText:'',
				 priceText:'',
				 browseText:'',
				 classifyText:'',
				 releasetimeText:'',
				 list: [
					 {
						name: '',
						type: 0,
					}, {
						name: '',
						type: 2,
					}, {
						name: '',
						type: 3,
					}, {
						name: '',
						type: 4,
					}
				],
				 params: {
					pageNo: 1,
					status: 0, //全部
					memberId:null,
					pageSize: 10,
				},
				moneyText:'',
				that:this,
				goodStatusDict:{
					1:this.$t('good.pendingreview.text'),
					2:this.$t('good.available.text'),
					3:this.$t('good.removed.text'),
					4:this.$t('good.sold.text'),
				},
			};
		},
	    onReachBottom() {
			if(this.loadMoreFlag){
			  this.getGoodPage()
			}
		},
		onPullDownRefresh() {
			setTimeout(() => {
				this.params.pageNo = 1
				this.goodDataList = []
				this.getGoodPage()
				//关闭下拉刷新
				uni.stopPullDownRefresh()
			},2000)
		},
		onLoad(){
			this.getGoodPage()	
		},
		onShow(){
		  this.refresh();	
		},
		filters: {
			statusName(val,that) {
				return that.goodStatusDict[val];
			}
		},
		methods:{
			onGoodClick(item){
				uni.navigateTo({
					url: 'pages/common/good/info?id='+item.id
				});
			},
			refresh(){
				this.moneyText = this.$t('common.money.text');
				this.emptyText = this.$t('common.empty.text');
				this.loadingText = this.$t('common.loading.text');
				this.loadmoreText = this.$t('common.loadmore.text');
				this.nomoreText = this.$t('common.nomore.text');
				this.list[0].name = this.$t('published.all.text');
				this.list[1].name = this.$t('published.available.text');
				this.list[2].name = this.$t('published.aemoved.text');
				this.list[3].name = this.$t('published.sold.text');
				this.deleteText = this.$t('common.delete.text');
				this.editText = this.$t('common.edit.text');
				this.superiorText = this.$t('common.superior.text');
				this.underText = this.$t('common.under.text');
				
				this.priceText = this.$t('common.price.text');
				this.browseText = this.$t('common.browse.text');
				this.classifyText = this.$t('common.classify.text');
				this.releasetimeText = this.$t('common.releasetime.text');
			},
			doEdit(id){
				uni.navigateTo({
					url: 'pages/common/good/release?id='+id
				});
			},
			doDelete(id){
				deleteGood({params: {id: id}}).then(res => {
					if (res.code === 0) {
						this.$refs.uToast.show({
							message: '删除成功',
							type: 'success',
						})
						this.getGoodPage();
					} else {
						uni.hideLoading();
						this.$refs.uToast.show({
							message: res.msg,
							type: 'error',
						})
					}
				});
			},
			doUpDownRack(id,status){
				upDownRack({params: {id: id,status:status}}).then(res => {
					if (res.code === 0) {
						this.$refs.uToast.show({
							message: '操作成功',
							type: 'success',
						})
						this.getGoodPage();
					} else {
						uni.hideLoading();
						this.$refs.uToast.show({
							message: res.msg,
							type: 'error',
						})
					}
				});
			},
			getGoodPage(){
				this.loadStatus = 'loading';
				this.params.memberId = jwt.getUserId();
				goodPage(this.params).then((res)=>{
					uni.stopPullDownRefresh()
					if(res.code === 0){
					  if(res.data.list.length === 0){
						this.isEmpty = true;
						this.loadStatus = 'nomore'
						this.loadMoreFlag = false;
					  }else if (res.data.list.length < 10) {
						this.loadStatus = 'nomore'
						this.loadMoreFlag = false;
					  } else {
						this.params.pageNo++;
						this.loadStatus = 'loading'
						this.loadMoreFlag = true;
					  }
					  if (this.params.pageNo > 1) {
						this.goodDataList = this.goodDataList.concat(res.data.list);
					  } else {
						this.goodDataList = res.data.list;
					  }
					}
				  }).catch(error=>{
					console.error(error)
				  })
			},
			click(item) {
				 this.params.status = this.list[item.index].type;
				 this.params.pageNo = 1;
				  this.$nextTick(() => {
					this.getGoodPage();
				  })
			},
		}
	}
</script>

<style lang="scss">
.bt-width{
	//width: 80rpx;
	padding: 0 20rpx;
	height: 50rpx;
	border-radius: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2rpx solid $goshop-text-color-three;
	font-size: $goshop-font-size-base;
}
.goshop-published-container{
	display: flex;
	flex-direction: column;
	.goshop-published-tabs{
		position: fixed;
		width: 100%;
		background-color: $goshop-color-auxiliary-one;
	}
	.goshop-published-wrap{
		margin-top: 30px;
		.goshop-published-list{
			padding: 20rpx;
			.goshop-published-item{
				background-color: $goshop-color-auxiliary-one;
				padding: 20rpx;
				border-radius: 20rpx;
				margin-bottom: 20rpx;
				.goshop-published-item-head{
					display: flex;
					justify-content: space-between;
					padding: 20rpx;
				}
				.goshop-published-item-body{
					padding: 20rpx;
					border-bottom: 2rpx solid $goshop-text-color-four;
					border-top: 2rpx solid $goshop-text-color-four;
					display: flex;
					.goshop-published-item-body-right{
						display: flex;
						flex-direction: column;
						flex: 3;
						padding: 0 20rpx;
						.goshop-published-item-body-right-center{
							display: flex;
							justify-content: space-between;
							align-items: center;
						}
					}
				}
				.goshop-published-item-footer{
					display: flex;
					justify-content: flex-end;
					align-items: center;
					padding: 20rpx 0;
					.goshop-published-item-footer-bt{
						margin-right: 20rpx;
					}
				}
			}
		}
	}
}
</style>
